<!-- 查看当前页的成交结算  -->
<template>
	<div>
		<el-breadcrumb separator="/" class="bread-title">
			<el-breadcrumb-item :to="{ path: '/transactionSettle' }">成交结算</el-breadcrumb-item>
			<el-breadcrumb-item>成交详情</el-breadcrumb-item>
		</el-breadcrumb>

	    <el-form :inline="true" :model="ruleForm" class="demo-form-inline">
	    	<el-form-item label="楼盘名称：">
				<el-input placeholder="请输入楼盘名称" v-model.trim="ruleForm.devName" maxlength="20" size="small"></el-input>
	    	</el-form-item>

	    	<el-form-item label="项目等级：" prop="level">
	    		<el-select v-model="ruleForm.projectLevelId" filterable style="width: 200px;" size="small">
	    			<el-option v-for="item in levellist"
	    				:key="item.id"
	    				:label="item.name"
	    				:value="item.id">
	    			</el-option>
	    		</el-select>
	    	</el-form-item>

	    	<el-form-item label="开发商类型：" prop="developers">
	    		<el-select v-model="ruleForm.developerId" filterable style="width: 200px;" size="small">
	    			<el-option v-for="item in devlist"
	    				:key="item.id"
	    				:label="item.developerName"
	    				:value="item.id">
	    			</el-option>
	    		</el-select>
	    	</el-form-item>
	    	<el-form-item>
	    		<el-button type="success"  @click="searchList" id="monitorEnter" size="small">查询</el-button>
	    	</el-form-item>
	    </el-form>

		<el-table :data="tableData" border style="width: 80%">
			<el-table-column label="序号" width="50" :formatter="inittotal" align="center"></el-table-column>
			<el-table-column label="楼盘名称" prop="devName" :formatter="initdevName" align="center"></el-table-column>
			<el-table-column label="开发商类型" prop="developerName" :formatter="initdeveloperName" align="center"></el-table-column>
			<el-table-column label="项目等级"  prop="projectLevelName" :formatter="initprojectLevelName" align="center"></el-table-column>
			<el-table-column label="成交套数"  prop="dealOrderNum"  align="center"></el-table-column>
			<el-table-column label="成交结算明细（元）"  prop="dealAmount" :formatter="initCash"  align="center"></el-table-column>
			<el-table-column label="订单查询" align="center">
				<template slot-scope="scope">
					<p v-if="scope.$index == 0">———</p>
					<el-button v-else type="text" @click="seehander(scope.row)">查看</el-button>
				</template>
			</el-table-column>
		</el-table>

		<div class="pagebar">
		  <el-pagination
		    background
		    layout="total, sizes, prev, pager, next"
		    :current-page.sync="ruleForm.pageNum"
		    :page-sizes="[10, 20, 30, 40]"
		    :page-size="ruleForm.pageSize"
		    @size-change="handleSizeChange"
		    @current-change="handleCurrentChange"
		    :total="totalSize">
		  </el-pagination>
		</div>

	</div>
</template>
<script>
    import api from '@/api/apiPath'
	export default {
		data () {
			return {
				ruleForm:{
					devName:undefined,
					month:undefined,
					projectLevelId:undefined,
					developerId:undefined,
					pageNum: 0,
					pageSize: 10,
				},
				levellist:[],
				devlist:[],
				totalSize:0,
				tableData:[],
			}
		},
		methods:{
			inittotal(row, column, cellValue, index){
				if(index == 0){
				    return '合计';
				}
				return index
			},
			initdevName(row, column, cellValue, index){
				if(index == 0){
				    return '———';
				}else {
					return row.devName
				}
			},
			initdeveloperName(row, column, cellValue, index){
				if(index == 0){
				    return '———';
				}else {
					return row.developerName
				}
			},
			initprojectLevelName(row, column, cellValue, index){
				if(index == 0){
				    return '———';
				}else {
					return row.projectLevelName
				}
			},
			initCash(row, column, cellValue, index){
			    if(cellValue !== 0){
			        return cellValue.toFixed(2).toString().replace(/\B(?=(\d{3})+(?!\d))/g,",");
			    }
			    if(cellValue == 0){
			        return "0.00"
			    }
			},
			handleCurrentChange(){
				this.getlist()
			},
			handleSizeChange(val){
				this.ruleForm.pageSize = val
				this.getlist();
			},
			getlist(){
				this.axios.post(api.DEALDETAILLIST,this.ruleForm).then((res) => {
					if (res.data.code == 200) {
						this.tableData = res.data.data.list;
						this.tableData.unshift(res.data.data.totalRow)
						this.totalSize = res.data.data.total;
					}
				})
			},
			searchList(){
				this.ruleForm.pageNum = 1
				this.getlist()
			},
			projectlevel(){
				this.axios.post(api.PROJECTLEVEL,this.ruleForm).then((res) => {
					if (res.data.code == 200) {
					    this.levellist = res.data.data
					}
				})
			},
			getAllDevList(){
				this.axios.post(api.getAllDevList,{}).then((res) => {
					if (res.data.code == 200) {
					    this.devlist = res.data.data
					}
				})
			},
			seehander(row){
				this.$router.push({path:'/transactionSettleOrder',query:{month:row.month,devId:row.devId,tmonth:this.ruleForm.month}})
			}
		},
		created(){
			this.ruleForm.month = this.$route.query.tdata
			this.projectlevel()
			this.getAllDevList()
			this.getlist()
		}
	}

</script>
<style lang="stylus" scoped>
</style>